<!-- 询价单行项目详细信息-排名信息 -->
<template>
  <el-dialog
    title="承运商排名信息"
    :visible.sync="dialogVisible"
    append-to-body
    width="60%"
  >
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :row-style="rowStyle"
      ref="crud"
      @refresh-change="refreshChange"
    >
    </avue-crud>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">关 闭</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getRanking } from "@/api/inquiry/index";

export default {
  data() {
    return {
      dialogVisible: false,
      loading: true,
      data: [],
      inquiryId: "",
      itemNo: "",
      itemId: "",
      zrateItem: "",
      carrierRanking: "", //当前承运商排名
      option: {
        height: "auto",
        calcHeight: 200,
        tip: false,
        searchShow: false,
        border: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        labelWidth: "180",
        menu: false,
        column: [
          {
            label: "排名",
            prop: "ranking",
          },
          {
            label: "承运商",
            prop: "partyName",
          },
          {
            label: "币别",
            prop: "docCurrency",
          },
          {
            label: "报价",
            prop: "price",
          },
        ],
      },
    };
  },
  computed: {},
  components: {},
  methods: {
    rowStyle({ row }) {
      if (row.ranking === this.carrierRanking) {
        return {
          color: "red",
        };
      }
    },
    refreshChange() {
      this.getList();
    },
    open(zrateItem, itemNo, inquiryId, itemId) {
      this.dialogVisible = true;
      this.inquiryId = inquiryId;
      this.itemNo = itemNo;
      this.itemId = itemId;
      this.zrateItem = zrateItem;
      this.getList();
    },
    //选择返回刷新
    refresh() {
      this.getList();
    },
    getList() {
      this.loading = true;
      getRanking({
        itemNo: this.itemNo,
        itemId: this.itemId,
        id: this.inquiryId,
        zrateItem: this.zrateItem,
      }).then((res) => {
        const data = res.data.data;
        this.data = data.rankingItemVOList;
        if (data.rankingItemVO.partyName) {
          this.data.unshift({ ...data.rankingItemVO });
          this.carrierRanking = data.rankingItemVO.ranking;
        }
        this.loading = false;
        this.$nextTick(() => {
          this.$refs.crud.$refs.table.doLayout();
        });
      });
    },
  },
};
</script>

<style></style>
